<template>
<!--pages/pay-result/pay-result.wxml-->
<view class="container">
	<view class="center" v-show="show">
		<el-image :src="imageUrl" style="width: 300px; height: 300px;">
		  <div slot="placeholder" class="image-slot">
			未上传<span class="dot">...</span>
		  </div>
		</el-image>
	</view>
  <view v-if="sts == 0">
    <view class="pay-sts fail">支付失败</view>
    <view class="tips">请在
      <text class="warn">30分钟</text>内完成付款</view>
    <view class="tips">否则订单会被系统取消</view>
    <view class="btns">
      <text class="button checkorder" @tap="toOrderList">查看订单</text>
      <text class="button payagain" @tap="payAgain">重新支付</text>
    </view>
  </view>

  <view v-if="sts == 1">
    <view class="pay-sts succ">请及时支付</view>
    <view class="tips">感谢您的购买,请点击录入订单按钮，否则话费无法到账</view>
    <view class="btns">
      <text class="button checkorder" @tap="toOrderList">查看订单</text>
      <text class="button shopcontinue" @tap="toIndex">继续购物</text>
    </view>
  </view>
 <view style="display: flex; justify-content: center; margin: 50px 200px 200px ;">
	<view class="btns">
		<el-input type="text" :disabled="true" v-model="orderInput"  style="max-width: 200px;" placeholder="请输入订单信息" />
	  <text style="margin-left: 10px;" class="button shopcontinue" @click="enterOrder">录入订单</text>
	</view>
  </view>
</view>

</template>
<style>
	.center {
		position: absolute;
		top: 40%;
		left:50%;
		transform: translate(-50%,-50%);
	}
</style>
<script>
var http = require("../../utils/http.js");
var util = require("../../utils/util.js");
var config = require("../../utils/config.js");
export default {
  data() {
    return {
		imageUrl:'',
	    orderInput: '',
		sts: 0,
		orderNumbers: '',
		qrcode: '', //二维码的内容链接
		size: 260, //二维码的大小
		unit: 'upx', //大小单位 !!! rpx单位有误
		load_make: true, //组件加载完成后自动生成二维码
		show_loading: false, //是否添加loading
		onval: true, //val值变化时自动重新生成二维码
		background: '#ffffff', //背景色
		foreground: '#000',//点色
		pdground: '#000', //角标色
		icon: '', //二维码图标
		iconsize: 30, //二维码图标大小
		lv: 3, //二维码容错级别
		loadingText: '加载中', //loading内容
		show:false,
    };
  },
  methods: {
	  enterOrder() {
		// 获取地址栏中的 orderNumbers 参数值
		const orderNumbers = this.$route.query.orderNumbers;
		this.orderInput = orderNumbers;
		console.log('订单号参数值为：', orderNumbers);
		var params = {
			url: "/p/orderEntry/orderNo",
			method: "post",
			data:{
				orderNumber:orderNumbers
			},
			callBack: res => {
				console.log(res)
				uni.showToast({
				  icon: "none",
				  title: res
				});
		  }
		};
		uni.hideLoading();
		http.request(params)
	  },
  	  showImage() {
  	    // 查询图片的方法，这里可以自行实现图片查询逻辑
  	    // 假设查询成功后，将图片链接赋值给imageUrl，并将show设置为true
  	    var params = {
  	    	url: "/user/file/getParentPaymentCode",
  	    	method: "POST",
  	  	responseType:"arraybuffer",
  	  	callBack: res => {
			console.log("aaa",res.byteLength)
		  if(res.byteLength != 0){
			  let blob = new Blob([res],{type: 'image/jpeg'});   // 返回的文件流数据
			  this.imageUrl = window.URL.createObjectURL(blob)
			  // 增加type 配置，设置下载资源的类型
			  console.log("imageUrl",this.imageUrl)
			    this.setData({
			      src: this.imageUrl,
				  show:true
			    });
			  }
		  }
  	    };
  	    uni.hideLoading();
  	    http.request(params)
  	  },
    toOrderList: function () {
      uni.navigateTo({
        url: '/pages/orderList/orderList?sts=0'
      });
    },
    toIndex: function () {
      uni.switchTab({
        url: '/pages/index/index'
      });
    },
    payAgain: function () {
      uni.showLoading({
        mask: true
      });
      var params = {
        url: "/p/order/pay",
        method: "POST",
        data: {
          payType: 1,
          orderNumbers: this.orderNumbers
        },
        callBack: function (res) {
          //console.log(res);
          uni.hideLoading();
          uni.requestPayment({
            timeStamp: res.timeStamp,
            nonceStr: res.nonceStr,
            package: res.packageValue,
            signType: res.signType,
            paySign: res.paySign,
            success: e => {
              console.log("支付成功");
              uni.redirectTo({
                url: '/pages/pay-result/pay-result?sts=1&orderNum=' + orderNumbers + "&orderType=" + this.orderType
              });
            },
            fail: err => {}
          });
        }
      };
      http.request(params);
    }
  },created() {
  	this.showImage()
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      sts: options.sts,
      orderNumbers: options.orderNumbers
    });
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
	  setTimeout(() => {
	  	//this.toOrderList();
	  },1200)
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
	  
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {},

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {},

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {}

};
</script>
<style>
@import "./pay-result.css";

</style>